// 引入样式
import "../../assets/css/normalize.less";
import "../../assets/css/reset.less";
import "../../assets/css/property.less";
import "../../assets/css/basic.less";
import "../myInfo/myInfo.less";

import { $ } from "../../utils/dom";
// 引入weui
import "weui";
import weui from "weui.js";

// 引入请求接口
import { postUploadPortraitReq, postUserChangeInfoReq } from "../../api/user";

// 引入轻提示
import { toast } from "../../utils/toast";
import { getProvinceReq, getCityReq } from "../../api/common";
import "../../assets/fonts/font_kok358gumca/iconfont.css";
import "../../assets/fonts/font_iysuojan2xi/iconfont.css";
import { all } from "axios";

/**
 * 上一个记录
 */
$(".icon-fanhui2").addEventListener("click", () => {
	// location.href="./my.html"
	history.back();
});

/**
 *  点击图片触发文件上传框
 *
 */
$(".portrait").addEventListener("click", () => {
	$("#file").click();
});

/**
 * 头像上传
 */
$("#file").addEventListener("change", () => {
	// console.dir($("#file"))
	const fd = new FormData();
	// 将图片信息添加到fd实例对象中
	fd.set("file", $("#file").files[0]);
	// 发送请求 上传fd
	postUploadPortraitReq(fd).then((res) => {
		let { errno, data } = res.data;
		if (errno === 0) {
			$(".portrait").src = "http://47.96.154.185:3701" + data + url;
		}
	});
});

/**
 * 性别
 */
let gender = 0;
$("#gender").addEventListener("click", () => {
	weui.picker(
		[
			{
				label: "女",
				value: 0,
			},
			{
				label: "男",
				value: 1,
			},
		],
		{
			onConfirm: function (result) {
				$("#genderVal").textContent = result[0].label;
				gender = result[0].value;
			},
			title: "选择性别",
		}
	);
});

/**
 * 生日
 */

$("#birthday").addEventListener("click", () => {
	weui.datePicker({
		start: 1990,
		end: new Date().getFullYear(),
		onConfirm: (r) => {
			$("#birthdayVal").textContent = r
				.map((v) => {
					return v.value < 10 ? "0" + v.value : v.value;
				})
				.join("-");

			// console.log(birthdayArr);
		},
		title: "选择出生年月日",
	});
});

/**
 * 省份
 */
let pId = 0; //选择身份的id号码
$("#province").addEventListener("click", async () => {
	let res = await getProvinceReq();
	let { errno, data } = res.data;
	let provinceArr = "";
	if (errno === 0) {
		provinceArr = data.map((v) => {
			return {
				label: v.name,
				value: v.id,
			};
		});
		console.log(provinceArr);
	}

	weui.picker(provinceArr, {
		onConfirm: function (result) {
			$("#provinceVal").textContent = result[0].label;
			pId = result[0].value;
		},
		title: "选择省份",
	});
});

/**
 * 城市
 */
let cityId = 0;
$("#city").addEventListener("click", async () => {
	let res = await getCityReq({ provinceId: pId });
	let { errno, data } = res.data;
	let cityArr = null;
	if (errno === 0) {
		cityArr = data.map((v) => {
			return {
				label: v.name,
				value: v.id,
			};
		});
	} else {
		weui.alert("请选择省份");
		return;
	}
	weui.picker(cityArr, {
		onConfirm: function (r) {
			$("#cityVal").textContent = r[0].label;
			cityId.textContent = r[0].value;
		},
		title: "选择城市",
	});
});

/**
 * 签名
 */
$("#sign").addEventListener("input", () => {
	let curlen = $("#sign").value.length;
	let allLen = $("#allLength").textContent;
	if (curlen > allLen) {
		$("#sign").value = $("#sign").value.slice(0, +allLen + 1);
		return;
	}
	$("#curLength").textContent = curlen;
});

/**
 * 保存信息
 */

console.log($("#btn"));
$("#btn").addEventListener("click", async () => {
	// 组装参数对象
	const params = {
		nickName: $("#nickName").value,
		gender: gender,
		provinceId: pId,
		cityId,
		birthday: $("#birthdayVal").textContent,
		imgUrl: "../../assets/imgs/headerPic.jpg",
		sign: $("#sign").value,
	};
	const res = await postUserChangeInfoReq(params);
	let { errno, data } = res.data;
	if (errno === 0) {
		sessionStorage.setItem("token", data.token);
		toast("保存成功");
		setTimeout(() => {
			location.href = "./my.html";
		}, 4000);
	} else {
		toast("保存失败");
	}
});

// 用户数据回填

const dataBackFill = async () => {
	let userInfo = JSON.parse(sessionStorage.getItem("userInfo"));
	// 请求省份和城市
	let province = await getProvinceReq();
	let city = await getCityReq({ provinceId: userInfo.provinceId });
	// 筛选省份和城市
	let provinceName = province.data.data.filter((v) => {
		return userInfo.provinceId === v.id;
	});

	let cityName = city.data.data.filter(v=>{
		return userInfo.cityId === v.id;
	})
	// 数据回填
	$("#nickName").value = userInfo.nickName;
	$("#sign").value = userInfo.sign;
	$("#genderVal").textContent = userInfo.gender === 1 ? "男" : "女";
	$("#birthdayVal").textContent = userInfo.birthday;
	$("#provinceVal").textContent = provinceName[0].name
	$("#cityVal").textContent = cityName[0].name
};
dataBackFill();
